<template>
  <div class="submit-info">
    <c-list :column="3">
      <c-list-item label="整改任务号" :value="detail.taskCode" />
      <c-list-item label="所属验收任务号" :value="detail.acceptTaskCode" />
      <c-list-item label="门店建设项目号" :value="detail.constCode" />
      <c-list-item label="所属门店编码" :value="detail.shopCode" />
      <c-list-item label="所属门店" :value="detail.shopName" />
      <c-list-item label="所属办事处" :value="detail.officeName" />
      <c-list-item label="报图类型" dict-type-code="MARKET_TYPE" :value="detail.marketType" />
      <c-list-item label="门店建设类型" dict-type-code="CONST_TYPE" :value="detail.constType" />
      <c-list-item label="整改类型" dict-type-code="ACCEPT_TYPE" :value="detail.rectifyType" />
      <c-list-item label="整改步骤" dict-type-code="RECTIFY_STEPS" :value="detail.steps" />
      <c-list-item label="预计整改完成时间" :value="detail.expectEndTime" />
      <c-list-item label="实际验收时间" :value="detail.actualAcceptTime" />
      <c-list-item v-if="rectifyType === 'SOFT'" label="责任归属" :value="detail.belongDuty" />
      <c-list-item label="整改验收责任人" :value="detail.acceptPrincipalName" />
      <c-list-item label="工程监理" :value="detail.proSupervisorName" />
      <c-list-item label="形象督导" :value="detail.formSupervisorName" />
    </c-list>
    <c-section title="整改结果">
      <c-permission-tabs>
        <el-tab-pane label="整改结果" name="result">
          <c-section title="问题明细">
            <c-table-box hide-func :index="false" no-request :data="tableData" :table-config="tableConfig">
              <el-table-column slot="before" type="expand" width="50">
                <template v-slot="{row}">
                  <div style="padding:10px">
                    <c-table-box :index="false" auto-height :data="row.problemDetailDTOList" hide-func :setting="false" :table-config="tableConfig1">
                      <!-- <el-table-column min-width="200" label="验收问题说明">
                        <template slot-scope="scope">
                          <el-tooltip v-if="scope.row.problemDesc" effect="dark" placement="top-start">
                            <span style="min-width:200px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
                              {{ scope.row.problemDesc }}
                            </span>
                            <template #content>
                              <div style="white-space:pre-wrap">{{ scope.row.problemDesc }}</div>
                            </template>
                          </el-tooltip>
                        </template>
                      </el-table-column> -->
                    </c-table-box>
                  </div>
                </template>
              </el-table-column>
            </c-table-box>
          </c-section>
          <c-section title="整改资料上传">
            <!-- <import-file
              :data="newFiles"
              :config-attachment-id="$route.query.id"
            /> -->

            <c-file-list v-model="newFiles" belong-model="ACCEPT_RECTIFY_TASK" attachment-type="整改附件" view-type="image" :model-id="$route.query.id" type-code="ACCESS031" />
          </c-section>
        </el-tab-pane>
        <el-tab-pane label="整改异常查看" name="abnormal">
          <c-section title="问题明细">
            <c-table-box hide-func :other-raw="paramsRaw" :other-filters="filtersRaw" :table-config="problemTableConfig" />
          </c-section>
          <c-section title="附件信息">
            <c-file-table-box v-model="files" :editable="false" :model-id="$route.query.id" />
          </c-section>
        </el-tab-pane>
      </c-permission-tabs>
    </c-section>
    <div class="btn-container">
      <c-button @click="cancelHandle">取消</c-button>
      <c-button type="primary" @click="confirmHandle">确定</c-button>
    </div>
  </div>
</template>
<script>
// import importFile from '@/components/importFile'
import { getOneDetail, postCommit } from '@/api/rectify'
export default {
  name: 'RectifySubmitInfo',
  // components: { importFile
  // },
  props: {
    rectifyType: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      detail: {},
      tableData: [],
      tableConfig: {
        interfacePath: '',
        setting: [
          {
            prop: 'belongDuty',
            label: '责任归属'
          },
          {
            prop: 'principalName',
            label: '责任人'
          },
          // {
          //   prop: 'actualAcceptTime',
          //   label: '实际验收时间',
          //   formatData: this.$parseTimeYMD('actualAcceptTime')
          // },
          {
            prop: 'mustRectifyEndTime',
            label: '应整改完成时间',
            formatData: this.$parseTimeYMD('mustRectifyEndTime')
          },
          {
            prop: 'actualRectifyEndTime',
            label: '实际整改完成时间',
            formatData: this.$parseTimeYMD('actualRectifyEndTime')
          }
        ]
      },
      tableConfig1: {
        setting: [
          {
            prop: 'problemType',
            label: '问题分类',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PROBLEM_CATEGORY'
            }
          },
          {
            prop: 'problemDesc',
            label: '验收问题说明',
            minWidth: 200,
            render: function(createElement, rows) {
              if (rows.problemDesc) {
                return (<div style='white-space:pre-wrap'>{rows.problemDesc }</div>
                )
              }
              return ''
            }
          },
          {
            prop: 'rectifyResult',
            label: '整改结果',
            editable: true,
            required: true,
            edit: {
              canEdit: true,
              editType: 'text'
            }
          }
        ]
      },
      newFiles: [], // 新上传的附件
      // 问题明细
      problemTableConfig: {
        interfacePath: '/slm-admin/api/v1/shopExceptionDetail/page',
        setting: [
          {
            prop: 'decorationRange',
            label: '装修范围',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'DECORATION_RANGE'
            },
            hidden: this.rectifyType === 'SOFT'
          },
          {
            prop: 'problemCategory',
            label: '问题分类',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PROBLEM_CATEGORY'
            }
          },
          {
            prop: 'stockoutType',
            label: '缺货类别',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'STOCKOUT_TYPE'
            }
          },
          {
            prop: 'exceptionDesc',
            label: '异常描述'
          },
          {
            prop: 'belongDuty',
            label: '责任归属',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BELONG_DUTY'
            }
          },
          {
            prop: 'isRelateDeduction',
            label: '是否涉及扣款',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'deductionDesc',
            label: '扣款说明'
          },
          {
            prop: 'solution',
            label: '异常解决方案'
          }
        ]
      },
      paramsRaw: {},
      filtersRaw: [{ 'id': 'state', 'property': 'state', 'operator': 'in', 'value': '[B]' }],
      // 附件
      files: []
    }
  },
  created() {
    this.paramsRaw = { modelId: this.$route.query.id }
    this.getDetail()
  },
  methods: {
    getDetail() {
      const { id } = this.$route.query
      getOneDetail(id).then(res => {
        this.detail = res.data
        this.tableData = this.detail.problemList.filter(e => e.acceptResult === 'UNQUALIFIED')
      })
    },
    cancelHandle() {
      this.$store.dispatch('views/goFirst')
    },
    confirmHandle() {
      let list = []
      this.tableData.forEach(row => {
        const data = row.problemDetailDTOList.filter(v => !v.rectifyResult)
        list = [...list, ...data]
      })
      if (list.length > 0) {
        this.$message.warning('请完善问题明细的整改结果')
        return
      }
      const data = {
        rectifyType: this.detail.rectifyType,
        problemList: this.tableData,
        files: this.$getFiles(this.newFiles, this.$route.query.id),
        id: this.$route.query.id
      }
      return postCommit(data).then(res => {
        this.$message.success('操作成功！')
        this.$store.dispatch('views/goFirst')
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.submit-info{

}
</style>
